<template>
	<view>
		<view :style="{height}"></view>
		<view :class="['set-submit-bt',{'u-flex':isBtnGroup}]" :style="{paddingBottom: bottom + 'rpx', backgroundColor: bgColor}">
			<fui-button :text="cancaelText" v-if="isBtnGroup"  @click="$emit('cancel')">
				<!-- <image v-if="textImg" :src="textImg" style="width: 30rpx;height: 30rpx;margin-left: 13rpx;" mode=""></image> -->
			</fui-button>
			<fui-button :text="text" @click="$emit('click')">
				<!-- <image v-if="textImg" :src="textImg" style="width: 30rpx;height: 30rpx;margin-left: 13rpx;" mode=""></image> -->
			</fui-button>
			<view class="u-text-center u-m-t-30" v-if="isDempShow">
				<text style="color: #999;font-size:30rpx;text-decoration: underline;" @tap="$emit('dempFn')" >
					跳过
				</text>
			</view>
		</view>
	</view>
</template>

<script setup>
	import { computed } from 'vue';
	defineEmits(['click','cancel','dempFn']);
	const {bottom,text,cancaelText,bgColor,isDempShow,isBtnGroup} = defineProps({
		bottom: {
			type: Number,
			default: 100
		},
		text: {
			type: String,
			default: '保存'
		},
		cancaelText: {
			type: String,
			default: '取消'
		},
		bgColor: {
			type: String,
			default: '#FFFFFF'
		},
		isBtnGroup:{
			type: Boolean,
			default: false
		},
		isDempShow:{
			type: Boolean,
			default: false
		}
	})
	const height = computed(() => {
		return 150 + bottom+(isDempShow?40:0) + 'rpx'
	})
</script>

<style scoped>
	.set-submit-bt {
		position: fixed;
		z-index: 900;
		width: 100%;
		bottom: 0;
		padding: 30rpx 35rpx 0 35rpx;
	}
</style>
